<!doctype html>
<html>
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0"/>
    <meta name="format-detection" content="telephone=no,email=no,date=no,address=no">
    <title>我的资金</title>
    <link rel="stylesheet" type="text/css" href="../../../css/api.css"/>
    <link rel="stylesheet" type="text/css" href="../../../css/common.css" />
    <link rel="stylesheet" type="text/css" href="../../../css/aui.css" />
    <link rel="stylesheet" type="text/css" href="../../../css/aui-pull-refresh.css" />
    <link rel="stylesheet" type="text/css" href="../../../css/swiper.min.css"/>
    <link rel="stylesheet" type="text/css" href="../../../css/style.css"/>
    <style>
    html,body{
        /*background: #fff;*/
    }
    .inner_header{
        font-size: 1.6rem;
        color: #000000;
        font-weight: 600;
        height: 6.9rem;
        margin: 0;
        padding: 2.4rem 0 0 0;
        box-sizing: border-box;
        background: none!important;
        box-shadow: 0rem 0rem 0.8rem 0rem rgba(0, 0, 0, 0.08);
        background: #fff!important;
    }

    .content{
        width: 100%;
        float: left;
        margin: 6.9rem 0 0 0;
    }
    .content_top{
        width: 100%;
        height: 19.55rem;
        background: #fff;
        float: left;
        margin: 0 0 0.9rem 0;
    }
    .content_top_box{
        width: 93%;
    	height: 17rem;
    	box-shadow: 0rem 0rem 0.65rem 0rem
    		rgba(227, 227, 227, 0.59);
    	border-radius: 0.7rem;
        margin:1.3rem auto 0 auto;
    }
    .content_top_box .box_top{
        width: 100%;
        height: 12.8rem;
        background-image: linear-gradient(-4deg,
        #53b1ff 0%,
        #3ca5fd 50%,
        #2498fa 100%),
    linear-gradient(
        #ffffff,
        #ffffff);
    background-blend-mode: normal,
        normal;
        border-radius: 0.7rem 0.7rem 0 0;
        position: relative;
    }
    .box_top_title{
        width: 100%;
    	height: 1.5rem;
        line-height: 1.5rem;
    	font-size: 1.5rem;
        box-sizing: border-box;
        padding:0 0 0 1.25rem;
        margin: 2.75rem 0 2.15rem 0;
    	letter-spacing: 0.03rem;
    	color: #ffffff;
        float: left;
    }
    .box_top_text{
        width: 100%;
        height: 4.69rem;
    	font-size: 4.69rem;
    	color: #ffffff;
        line-height: 4.69rem;
        float: left;
        box-sizing: border-box;
        padding: 0 0 0 1.35rem;
    }
    .box_top_icon{
        width: 6.2rem;
    	height: 2.5rem;
    	background-color: rgba(255,255,255,0.91);
    	border-radius: 1.25rem 0rem 0rem 1.25rem;
        position: absolute;
        top: 5.15rem;
        right: 0;
        text-align: center;
        color: #319ffb;
        letter-spacing: 0.03rem;
        font-size: 1.2rem;
        line-height: 2.5rem;
    }
    .box_top_icon img{
        display: inline;
        width: 0.9rem;
	    height: 1.05rem;
        margin: 0 0.6rem 0 0;
        position: relative;top: 0.2rem;
    }
    .box_bottom{
        width: 100%;
        height: 4.2rem;
        text-align: center;
        line-height: 4.2rem;
        font-size: 1.6rem;
        letter-spacing: 0.03rem;
	    color: #2599fa;
    }
    .content_li{
        width: 100%;
        height: 4.6rem;
        line-height:4.6rem;
    	font-size: 1.5rem;
        color: #333333;
        /*border-bottom:0.05rem solid #e5e5e5;*/
        float: left;
        background: #fff;
        padding: 0 0 0 1.3rem;
        box-sizing: border-box;
        position: relative;
    }
    .content_li_box{
        width: 100%;
        height: 100%;
        border-bottom:0.05rem solid #e5e5e5;
    }
    .border_none{
        border-bottom: none
    }
    .content_li_box img{
        float: right;
        width: 0.7rem;
	    height: 1.3rem;
        margin:  1.65rem 1.3rem 0 0;
    }
    </style>
</head>
<body>
<div id="app">
    <header class="aui-bar aui-bar-nav aui-bar-light inner_header">
      <a class="aui-pull-left aui-btn" onclick="goBack()">
          <img src="../../../image/back.png">
      </a>
      <div class="aui-title">我的资金</div>
    </header>
    <div class="content">
        <div class="content_top">
            <div class="content_top_box">
                <div class="box_top">
                    <div class="box_top_title">账户余额(元)</div>
                    <div class="box_top_text">{{user_info.wallet}}</div>
                    <div class="box_top_icon" @click="go_url('capital_details','./capital_details.html','put_forward')">
                        <img src="../../../image/capital/icon1.png" alt="">明细
                    </div>
                </div>
                <div class="box_bottom" @click="go_url('capital_recharge','./recharge.html','recharge')">去充值</div>
            </div>
        </div>
        <div class="content_li" @click="go_url('capital_recharge','./recharge.html','put_forward')">
            <div class="content_li_box">
                提现申请 <img src="../../../image/capital/icon4.png" alt="" >
            </div>
        </div>
        <div class="content_li">
            <div class="content_li_box" @click="go_url('capital_bank_card','./bank_card.html','')">
                银行卡 <img src="../../../image/capital/icon4.png" alt="">
            </div>
        </div>
        <!-- <div class="content_li">
            <div class="content_li_box border_none">
                账户绑定 <img src="../../../image/capital/icon4.png" alt="">
            </div>
        </div> -->
    </div>
</div>
</body>
</html>
<script type="text/javascript" src="../../../script/api.js"></script>
<script type="text/javascript" src="../../../script/zepto.js"></script>
<script type="text/javascript" src="../../../script/vue.min.js"></script>
<script type="text/javascript" src="../../../script/swiper.min.js"></script>
<script type="text/javascript" src="../../../script/utils.js"></script>
<script type="text/javascript" src="../../../script/common.js"></script>
<script type="text/javascript" src="../../../script/aui-tab.js"></script>
<script type="text/javascript" src="../../../script/aui-scroll.js"></script>
<script type="text/javascript" src="../../../script/aui-pull-refresh.js"></script>

<script type="text/javascript">

  apiready = function(){
    //setRefresh()
    var user_info = $api.getStorage('user_info');
    var token = $api.getStorage('token');
    var vue = new Vue({
        el:"#app",
        data:{
            token:token,
            user_info:user_info
        },
    })
  }
  function goBack(){
      api.closeWin({});
  }

  //刷新
  function setRefresh(){
      var pullRefresh = new auiPullToRefresh({
          container: document.querySelector('.aui-refresh-content'),
          triggerDistance: 100
      }, function(ret) {

          if (ret.status == "success") {
              setTimeout(function() {
                  pullRefresh.cancelLoading(); //刷新成功后调用此方法隐藏
              }, 1500)
          }
      })
  }
  function go_url(name, url, get) {
      // console.log(get);
      api.openWin({
          name: name,
          url: url,
          pageParam: {
              data:get,
          }
      });
  }

</script>
